$borderColor: #f2f2f2;
$borderColorDC: #dcdcdc;
$colorRed: #ff5151;
$colorBlack: #000;
$colorGreen: #3fa93f;
$colorBlue: #2299d5;
$colorGray: #9b9b9b;

.lotteryCharts {
  //padding-bottom: 15px;
  padding-top: 160px;
}

.lotChartsBack {
  text-align: center;
  .chartTabContent{
    overflow-y: scroll;
  }
}

//pc蛋蛋
.chartVeryPc{
  height: 100%;
  width: 100%;
  .pcVeryUl {
    background: #f2f2f2;
    text-align: center;
    line-height: 20px;
    li {
      padding: 5px;
      &:first-child {
        width: 120px;
        display: inline-block;
      }
      &:nth-child(2) {
        width: 300px;
      }
      &.flexLot {
        flex: 1;
      }
    }
  }
  .pcVeryDataUl {
    border: 1px solid $borderColor;
    text-align: center;
    color: #666;
    li {
      border-bottom: 1px solid $borderColor;
      line-height: 35px;
      p {
        border-right: 1px solid $borderColor;
        &:first-child {
          width: 120px;
          display: inline-block;
        }
        &:nth-child(2) {
          width: 300px;
          span {
            width: 25px;
            height: 25px;
            background: $colorRed;
            display: inline-block;
            border-radius: 50%;
            line-height: 25px;
            text-align: center;
            font-size: 16px;
            font-family: Arial;
            color: #fff;
            margin: 0 10px;
            position: relative;
            &:after {
              content: '+';
              font-size: 18px;
              position: absolute;
              top: 0;
              right: -15px;
              color: #ff5151;
            }
            &:nth-of-type(3):after {
              content: '=';
            }
            &:last-of-type:after {
              content: '';
            }
            &.green {
              background: $colorGreen;
            }
            &.blue {
              background: $colorBlue;
            }
            &.gray {
              background: $colorGray;
            }
          }
        }
        &.lotGD11Span {
          span {
            margin: 0 5px;
            &:after {
              content: '';
            }
            &:nth-of-type(3):after {
              content: '';
            }
          }
        }
        &.kjRes {
          flex: 1;
        }
      }
      &:last-child {
        border-bottom: none;
      }
    }
  }
}


/*广东11选5*/
.lotGD11 {
  width: 100%;
  height: 100%;
  position: relative;
  //height: 475px;
  overflow-x: scroll;
  .lotGDDiv11 {
    display: inline-block;
    margin: 0 auto;
  }
}

.lotGDChartsTitle {
  //border: 1px solid $borderColorDC;
  ul {
    li {
      float: left;
      text-align: center;
      background: #f2f2f2;
      &:first-child {
        width: 120px;
        line-height: 60px;
        border-top: 1px solid $borderColorDC;
        border-left: 1px solid $borderColorDC;
      }
      &.lotteryNumber {
        width: 200px;
        line-height: 60px;
        border-top: 1px solid $borderColorDC;
        border-left: 1px solid $borderColorDC;
      }
      &.andTheVal {
        width: 60px;
        line-height: 60px;
        border-top: 1px solid $borderColorDC;
        border-left: 1px solid $borderColorDC;
      }
      &.lotBjkl8{
        width: 800px;
      }
      &.lotTerminal {
        width: 400px;
      }
      &.lotLsCode {
        p {
          line-height: 30px;
          &:first-child {
            border-top: 1px solid $borderColorDC;
            border-left: 1px solid $borderColorDC;
          }
          &:last-of-type {
            span {
              width: 30px;
              height: 30px;
              border-top: 1px solid $borderColorDC;
              border-left: 1px solid $borderColorDC;
              display: inline-block;
              &:last-of-type {
                border-right: none;
              }
            }
          }
        }
      }
      &:last-child {
        border-right: 1px solid $borderColorDC;
      }
      &.teamVal {
        p {
          width: 80px;
          height: 61px;
          line-height: 61px;
          float: left;
          border-top: 1px solid $borderColorDC;
          border-left: 1px solid $borderColorDC;
        }
      }
    }
  }
}

.lotGDChartsCenter {
  //border: 1px solid $borderColorDC;
  border-top: none;
  position: relative;
  padding-bottom:30px;
  ul {
    height: 30px;
    li {
      float: left;
      text-align: center;
      line-height: 30px;
      &:first-child {
        width: 120px;
        border-top: 1px solid $borderColorDC;
        border-left: 1px solid $borderColorDC;
      }
      &:last-child{
        border-right: 1px solid $borderColorDC;
      }
      &.lotteryNumber ,&.andTheVal {
        width: 200px;
        border-top: 1px solid $borderColorDC;
        border-left: 1px solid $borderColorDC;
        p {
          width: 24px;
          height: 24px;
          background: $colorRed;
          border-radius: 50%;
          color: #fff;
          font-size: 14px;
          font-family: Arial;
          display: inline-block;
          margin: 3px 5px;
          line-height: 24px;
          &.red{
            background: $colorRed;
          }
          &.black{
            background: $colorBlack;
          }
        }
      }
      &.lotBjkl8{
        width: 800px;
      }
      &.andTheVal {
        width: 60px;
        p {
          &.red {
            background: $colorRed;
          }
          &.green {
            background: $colorGreen;
          }
          &.blue {
            background: $colorBlue;
          }
          &.gray {
            background: $colorGray;
          }
        }
      }
      &.lotTerminal {
        width: 400px;
        p {
          border-radius: 4px;
        }
      }
      &.lotLsCode {
        p {
          width: 30px;
          height: 30px;
          border-top: 1px solid $borderColorDC;
          border-left: 1px solid $borderColorDC;
          display: inline-block;
          &:last-of-type {
            border-right: none;
          }
          &.lotParTrue {
            opacity: 0.3;
          }
          &.lotParTrue.on {
            opacity: 1;
          }
          &.on {
            //width: 24px;
            //height: 24px;
            //background: $colorRed;
            //border-radius: 50%;
            //color: #fff;
            //font-size: 14px;
            //font-family: Arial;
            //display: inline-block;
            //margin: 3px;
            line-height: 24px;
            span {
              width: 24px;
              height: 24px;
              background: $colorRed;
              border-radius: 50%;
              color: #fff;
              font-size: 14px;
              font-family: Arial;
              display: inline-block;
              line-height: 24px;
              margin: 3px;
            }
          }
        }
        &:last-child {
          border-right: 1px solid $borderColorDC;
        }
      }
      &.teamVal {
        p {
          width: 80px;
          height: 30px;
          line-height: 30px;
          float: left;
          border-top: 1px solid $borderColorDC;
          border-left: 1px solid $borderColorDC;
          span {
            width: 24px;
            height: 24px;
            display: inline-block;
            border-radius: 50%;
            margin: 2px;
            color: #fff;
            line-height: 24px;
            &.red {
              background: $colorRed;
            }
            &.green {
              background: $colorGreen;
            }
            &.blue {
              background: $colorBlue;
            }
            &.gray {
              background: $colorGray;
            }
          }
        }
      }
    }
    &.lotGDChartsLastItem {
      border-bottom: 1px solid $borderColorDC;
    }
  }
}

/*画图*/
#myCanvas {
  //width: 100%;
  position: absolute;
  top: -28px;
  //top: 0;
  left: 0;
  //background: rgba(255,255,255,0.5);
  //display: none;

}

.myCanvasHidden {
  opacity: 0;
}

/*快乐六合彩*/
.lotHappyMain {
  text-align: center;
}

.lotHappyLH {
  display: inline-block;
  .lotHappyTitle {
    background: #f2f2f2;
    line-height: 40px;
    li {
      float: left;
      width: 60px;
      &:first-child {
        width: 120px;
      }
      &:nth-child(2) {
        width: 350px;
      }
    }
  }
}

.lotHappyCenter {
  border: 1px solid #f2f2f2;
  section {
    float: left;
    width: 60px;
    padding: 5px 0;
    line-height: 35px;
    height: 48px;
    border-right: 1px solid #f2f2f2;
    &:first-child {
      width: 120px;
    }
    &:nth-child(2) {
      width: 350px;
      p {
        display: inline-table;
        width: 35px;
        height: 35px;
        background: $colorRed;
        color: #fff;
        font-size: 16px;
        font-family: Arial;
        border-radius: 50%;
        margin: 0 1px;
        line-height: 24px;
        position: relative;
        top: -3px;
        .zodiacSX {
          position: absolute;
          bottom: -2px;
          left: 0;
          font-size: 12px;
          width: 100%;
          text-align: center;
        }
        &:last-of-type {
          margin-left: 20px;
          position: relative;
          overflow: visible;
        }
        &:last-of-type:after {
          content: '+';
          font-size: 18px;
          color: #333;
          position: absolute;
          left: -18px;
          top: 5px;
        }
        &.red {
          background: $colorRed;
        }
        &.green {
          background: $colorGreen;
        }
        &.blue {
          background: $colorBlue;
        }
        &.gray {
          background: $colorGray;
        }
      }
    }
    &:last-of-type {
      border-right: none;
    }
  }
}
